{extend name="base"/}
{block name="resources"}
<style>
	.add-shop{
		display: flex;
		justify-content: center;
		flex-direction: column;
		align-items: center;
	}
	.add-shop li{
		display: flex;
		margin: 20px 0;
	}
	.add-shop li span{
		display: flex;
		align-items: center;
		justify-content: center;
		border: 1px solid;
		padding: 5px;
		margin-right: 5px;
		width: 10px;
		height: 10px;
		border-radius: 50%;
	}
</style>
{/block}
{block name="main"}
<div class="layui-collapse ns-tips">
	<div class="layui-colla-item">
		<h2 class="layui-colla-title">操作提示</h2>
		<ul class="layui-colla-content layui-show">
			<li>当前页面对店铺的信息进行管理，可以添加店铺，查看店铺账户信息，认证信息等。</li>
		</ul>
	</div>
</div>

{if $business_type != 3}
<div class="ns-single-filter-box">
   <button class="layui-btn ns-bg-color" onclick="clickAdd()">添加店铺</button>
</div>
{/if}
<div class="ns-screen layui-collapse" lay-filter="selection_panel">
	<div class="layui-colla-item">
		<h2 class="layui-colla-title">筛选</h2>
		<form class="layui-colla-content layui-form layui-show">

			<div class="layui-form-item">
				<div class="layui-inline">
					<label class="layui-form-label">店铺名称：</label>
					<div class="layui-input-inline">
						<input type="text" name="search_text" placeholder="请输入店铺名称" class="layui-input" autocomplete="off">
					</div>
				</div>

				<div class="layui-inline">
					<label class="layui-form-label">商家账号：</label>
					<div class="layui-input-inline">
						<input type="text" name="username" placeholder="请输入商家账号" class="layui-input" autocomplete="off">
					</div>
				</div>
			</div>

			<div class="ns-form-row">
				<button class="layui-btn ns-bg-color" lay-submit lay-filter="search">筛选</button>
				<button class="layui-btn ns-bg-color" lay-submit lay-filter="export">导出</button>
				<button type="reset" class="layui-btn layui-btn-primary">重置</button>
			</div>
		</form>
	</div>
</div>

<!-- 列表 -->
<table id="shop_list" lay-filter="shop_list"></table>

<!-- 工具栏操作 -->
<script type="text/html" id="operation">
	<div class="ns-table-btn">
		<a class="layui-btn" lay-event="detail">店铺详情</a>
		<!--<a class="layui-btn" lay-event="change_domain">修改域名</a>-->
		<!--<a class="layui-btn" lay-event="edit">修改</a>-->
		<a class="layui-btn" lay-event="delete">删除</a>
	</div>
</script>

<!-- 重置密码弹框html -->
<script type="text/html" id="change_domain">
	<div class="layui-form">
		<div class="layui-form-item">
			<label class="layui-form-label mid">新域名：</label>
			<div class="layui-input-block">
				<input type="text" name="site_domain"  class="layui-input ns-len-mid" autocomplete="off">
			</div>
		</div>
		<div class="ns-form-row mid">
			<button class="layui-btn ns-bg-color" lay-submit lay-filter="domian">确定</button>
			<button class="layui-btn layui-btn-primary" onclick="closeDomian()">返回</button>
		</div>

		<input class="reset-pass-id" type="hidden" name="site_id" value="{{d.site_id}}"/>
	</div>

</script>
{/block}

{block name="script"}
<script id="addShop" type="text/html">
	<div class="add-shop">
		<h1>开店流程</h1>
		<ul>
			<li><span>1</span>点击用户列表，添加用户。</li>
			<li><span>2</span>添加店铺。</li>
		</ul>
		<button class="layui-btn ns-bg-color">创建店铺</button>
	</div>
</script>

<script>
	layui.use(['form', 'laydate', 'laytpl'], function() {
		var table,
			form = layui.form,
			laytpl = layui.laytpl;
			laydate = layui.laydate;
		form.render();

		table = new Table({
			elem: '#shop_list',
			url: ns.url("admin/shop/lists"),
			cols: [
				[{
					field: 'site_name',
					title: '店铺名称',
					width: '15%',
					unresize: 'false',
				}, {
					field: 'username',
					title: '所属用户',
					width: '13%',
					unresize: 'false'
				}, {
					field: 'group_name',
					title: '店铺套餐',
					width: '12%',
					unresize: 'false'
				} ,{
					field: 'create_time',
					title: '开店时间',
					width: '15%',
					unresize: 'false',
					templet: function(data) {
						return ns.time_to_date(data.create_time);
					}
				}, {
					field: 'expire_time',
					title: '到期时间',
					width: '15%',
					unresize: 'false',
					templet: function(data) {
						return ns.time_to_date(data.expire_time);
					}
				}, {
					field: 'is_try',
					title: '是否试用',
					width: '10%',
					unresize: 'false',
					templet: function(data) {
						return data.is_try == 1 ? '是' : '否';
					}
				}, {
                    field: 'status',
                    title: '状态',
                    width: '10%',
                    unresize: 'false'
                }, {
					title: '操作',
					width: '10%',
					toolbar: '#operation',
					unresize: 'false'
				}]
			]
		});
		
		/**
		 * 搜索功能
		 */
		form.on('submit(search)', function(data) {
			table.reload({
				page: {
					curr: 1
				},
				where: data.field
			});
			return false;
		});

        //批量导出
        form.on('submit(export)', function(data){
            data.field.order_type = 1;
            location.href = ns.url("admin/shop/exportShop",data.field);
            return false;
        });

		/**
		 * 监听工具栏操作
		 */
		table.tool(function(obj) {
			var data = obj.data,
				event = obj.event;
			switch (event) {
				case 'detail': //基本信息
					location.href = ns.url("admin/shop/shopDetail?site_id=" + data.site_id);
					break;
				case 'change_domain'://修改域名
					changeDomain(data);
					break;
				case 'edit':
					location.href = ns.url("admin/shop/edit" + "?site_id=" + data.site_id);
                    break;
                case 'delete':

                    layer.confirm('确认删除该店铺吗？', function() {
                        $.ajax({
                            url: ns.url("admin/shop/delete"),
                            data: {
                                site_id: data.site_id
                            },
                            dataType: 'JSON',
                            type: 'POST',
                            success: function(res) {
                                layer.msg(res.message);
                                if (res.code == 0) {
                                    table.reload();
                                }
                            }
                        });
                    });

			}
		});

		/**
		 * 重置密码
		 */
		function changeDomain (data) {
			laytpl($("#change_domain").html()).render(data, function(html) {
				layer_domian = layer.open({
					title: '重置域名',
					skin: 'layer-tips-class',
					type: 1,
					area: ['600px'],
					content: html,
				});
			});
		}

		form.on('submit(domian)', function(data) {
			if (repeat_flag) return false;
			repeat_flag = true;
			$.ajax({
				type: "POST",
				dataType: 'JSON',
				url: ns.url("admin/shop/changeDomain"),
				data: data.field,
				success: function(res) {
					repeat_flag = false;

					if (res.code == 0) {
						layer.msg('操作成功');
						location.reload();
					} else {
						layer.msg(data.message)
					}
				}
			});
		});
	});
	
	function closeDomian() {
		layer.close(layer_domian);
	}

	function clickAdd() {
		layer.open({
			type:1,
			title: '添加店铺',
			content: $("#addShop").html(),
			offset: 'auto',
			area: ['450px','270px']
		});
		$(".add-shop button").click(function(){
			location.href = ns.url('admin/sysuser/lists');
		});
	}
</script>
{/block}